<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<table>
		 <tr>
			<td><img src=""></td>
			<td colspan="3">购物简易计算器</td>
		 </tr>
		 <tr>
			<td>第一个数</td>
			<td colspan="3">
				<input type="text" id="num1Id"/>
			</td>
		 </tr>
		 <tr>
			<td>第二个数</td>
			<td colSpan="3">
			<input type="text" id="num2Id" />
			</td>
			</tr>
		 <tr>
			<td>
				<input type="button" value=" + " onclick="cal('+')"/>
			</td>
		    <td>
			    <input type="button" value=" - " onclick="cal('-')"/>
			</td>
			<td>
				<input type="button" value=" * " onclick="cal('*')"/>
			</td>
			<td>
				<input type="button" value=" / " onclick="div()"/>
			</td>
		 </tr>
		<tr>
			<td>计算结果</td>
			<td colSpan="3">
				<input  type="text" id="resultId" />
			</td>
		</tr>
	    </table>
	<script type="text/javascript">
		function cal(type) {
			/* 元素节点的获取：
			document.getElementById( id属性值);
			document.getElementsByTagName("标签名")； */
			var num1 = document.getElementById('num1Id').value;
			var num2 = document.getElementById('num2Id').value;
			//eval()   '3+5'   '3-5'  '3*5'
			var result = eval(parseInt(num1) + type + parseInt(num2));
			var resultObj = document.getElementById('resultId');
			resultObj.value = result;
		}
				  
		//把变化的数据作为参数传递过来
		function cal2(type) {
			var num1 = document.getElementById('num1Id').value;
			var num2 = document.getElementById('num2Id').value;
			var result = 0;
			switch (type){
				case '+':
					result = parseInt(num1) + parseInt(num2);
					break;
				case '-':
					result = parseInt(num1) - parseInt(num2);
					break;
				case '*':
					result = parseInt(num1) * parseInt(num2);
					break;
				case '/':
					result = parseInt(num1) / parseInt(num2);
					break;
				default:
					break;
			}
			var resultObj = document.getElementById('resultId');
			resultObj.value = result;
		}
				  
				  
		function add() {
			var num1 = document.getElementById('num1Id').value;
			var num2 = document.getElementById('num2Id').value;
			var result = parseInt(num1) + parseInt(num2);
			var resultObj = document.getElementById('resultId');
			resultObj.value = result;
		}
				  
		function sub() {
			var num1 = document.getElementById('num1Id').value;
			var num2 = document.getElementById('num2Id').value;
			var result = parseInt(num1) - parseInt(num2);
			var resultObj = document.getElementById('resultId');
			resultObj.value = result;
		}
				  
		function mul() {
			var num1 = document.getElementById('num1Id').value;
			var num2 = document.getElementById('num2Id').value;
			var result = parseInt(num1) * parseInt(num2);
			var resultObj = document.getElementById('resultId');
			resultObj.value = result;
		}
				  
		function div() {
			var num1 = document.getElementById('num1Id').value;
			var num2 = document.getElementById('num2Id').value;
			var result = parseInt(num1) / parseInt(num2);
			var resultObj = document.getElementById('resultId');
			resultObj.value = result;
		}
		</script>
	</body>
</html>